<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>盒子模型</title>
		<style>
			.box{
				width:200px;
				height:300px;
				/*border-style:solid;/*边框样式*/
				/* border-width:1px; /*边框粗细*/ */
				/* border-color:yellow;/*边框的颜色*/ */
				/*复合写法  border:粗细, 颜色,样式;*/
				border:1px red solid;
				/* 内边距padding,内容到边框的距离*/
				/* padding-top:100px; /*上内边距 */ */
				/* padding-bottom:20px; /*下内边距*/ */
				/* padding-left:30px;   /*左内边距*/ */
				/* padding-right:40px;  /*右内边距*/ */
				/* 复合写法padding:加上大小值 数值大小不同，边框大小也会发生变化*/
				/* padding:10px 20px 30px 40px;   上右下左顺时针 */
				padding:10px 20px 30px 40px;
				padding:10px 20px;  /*左  上，下   右*/
				padding:10px; /*四个边都一样*/
			}
		</style>
	</head>
	<body>
		<!-- 4个要素：内容content .内边距padding.边框border.外边距margin -->
		<div>
			hello world
			
		</div>
		
	</body>
</html>
